'use strict';
import React, {Component} from "react";
import {StyleSheet, View, Image, TouchableOpacity} from "react-native";
import ScrollableTabView from "react-native-scrollable-tab-view";
import FoundPageTabBar from "../Components/FoundPageTabBar";
import FoundPageTabNewPage from "../Components/FoundPageTabNewPage";
import FoundPageTabDiscussPage from "../Components/FoundPageTabDiscussPage";
import StrategyPage from '../Components/StrategyPage';
import FoundPageTabActivityPage from "../Components/FoundPageTabActivityPage";
import MoreMenu, {MORE_MENU} from "../Components/MoreMenu";
import Global from "../Commom/GlobalConst";
let tabBarNames = ['精选', '攻略', '活动'];

export default class FoundPage extends Component {
    constructor(props) {
        super(props);
        this.state = {
            searchList: [],
            index: 0,
        }
    }

    _onPress() {
        this.refs.MoreMenu.open();
    }

    onSearchContent(searchText) {
        console.log(searchText, this.state.index);
        if (this.state.index == 0) {
            this.refs.NewPage.NewSearch(searchText);
        } else if (this.state.index == 1) {
            this.refs.HotPage.HotSearch(searchText);
        } else if (this.state.index == 2) {
            this.refs.ActivityPage.ActivitySearch(searchText);
        }
    }

    page(num) {
        this.setState({
            index: num,
        });
    }

    onFoundPress(showFound) {

    }

    render() {
        return (
            <View style={styles.container}>
                <ScrollableTabView
                    ref="ScrollView"
                    tabBarPosition={'top'}
                    prerenderingSiblingsNumber={3}
                    onChangeTab={(obj) => {this.page(obj.i)}}
                    renderTabBar={() =>
                    <FoundPageTabBar
                    tabBarNames={tabBarNames}
                    searchFun={(search)=>this.onSearchContent(search)}
                    onFoundPress={(showFound)=>this.onFoundPress(showFound)}
                    />}
                >
                    <FoundPageTabNewPage
                        ref="NewPage"
                        navigator={this.props.navigator} tabLable={tabBarNames[0]}/>
                    {/*<FoundPageTabDiscussPage*/}
                        {/*ref="HotPage"*/}
                        {/*navigator={this.props.navigator} tabLable={tabBarNames[1]}/>*/}
                        <StrategyPage
                            ref="HotPage"
                            navigator={this.props.navigator} tabLable={tabBarNames[1]}/>
                    <FoundPageTabActivityPage
                        ref="ActivityPage"
                        navigator={this.props.navigator} tabLable={tabBarNames[2]}/>
                </ScrollableTabView>
                <TouchableOpacity
                    ref='moreMenuButton'
                    style={{
                        padding: 5,
                        position: 'absolute',
                        top: 25,
                        right: 5,
                    }}
                    onPress={() => this._onPress()}>
                    <View style={{paddingRight: 8}}>
                        <Image style={{
                            width: 20,
                            height: 20
                        }} source={require('../../Image/icon_add_green.png')}/>
                    </View>
                </TouchableOpacity>
                <MoreMenu
                    ref="MoreMenu"
                    contentStyle={{
                        right: 20,
                        top: 0
                    }}
                    menus={[MORE_MENU.InitiatedWithTour, MORE_MENU.InitiatedQuestion]}
                    anchorView={this}
                    navigator={this.props.navigator}
                    contentMarginRight={20}
                />
            </View>
        );
    }
}

var styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: Global.Const.colorWhite,
    },
});